import React from 'react'
import { hasPermission } from '../utils/auth'
import type { PermissionType } from '../utils/auth'

interface PermissionGateProps {
  permission: PermissionType
  children: React.ReactNode
  fallback?: React.ReactNode
}

/**
 * 权限控制组件
 * 根据用户权限决定是否显示子组件
 */
const PermissionGate: React.FC<PermissionGateProps> = ({ 
  permission, 
  children, 
  fallback = null 
}) => {
  const hasAccess = hasPermission(permission)
  
  return hasAccess ? <>{children}</> : <>{fallback}</>
}

export default PermissionGate
